<template>
	<div class="content">
	<div class="left">
		<keep-alive>
				<articleList ></articleList>
		</keep-alive>


	</div>
	<div class="right">
		<Info></Info>
		<Recommend></Recommend>

	</div>
	</div>
</template>

<script>
import ArticleList from '@/components/articleList/articleList.vue';
import Info from '@/components/info/info.vue';
import Recommend from '@/components/recommend/recommend.vue';
	export default {
		data(){
			return{

			}
		},
		components:{
			ArticleList,
			Info,
			Recommend
		}
		
	}
</script>

<style scoped>
.content{
	height: 100%;
	width: 100%;
	display: flex;
	justify-content: center;
	margin-top: 2vh;
	margin-bottom: 2vh;
}
.content .left{
	height: 100%;
	width: 50vw;
	/* background: rgb(145, 226, 159); */
	margin-right: 0.5vw;
}
.content .right{
	height: 100vh;
	width: 20vw;
	/* background: rgb(164, 217, 233); */
}



</style>